import Taro, { Component } from '@tarojs/taro'
import { View, Text, Image, Picker, Swiper, SwiperItem } from '@tarojs/components'
import {AtForm,AtInput,AtIcon,AtButton,AtSwitch,AtActionSheet, AtActionSheetItem} from 'taro-ui'
import './suifangmodel.css'
// import reactMixin from 'react-mixin';
// import myJs from '../../pages/editsuifangfangan/editsuifangfanganjs.js'
import app from '../../../../main.js'

export default class SuifangModel extends Component {
    config = {
        navigationBarTitleText: '编辑随访方案'
    }
    // constructor () { 
    //     super(...arguments); 
    //     this.state = this.getData(); 
    // }
    constructor(){
        super(...arguments);
        this.state={
            selectorChecked:'一天',
            selector: [[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,57,58,59,60,61,62,63,64,65,66,67,68,69,70,71,72,73,74,75,76,77,78,79,80,81,82,83,84,85,86,87,88,89,90,91,92,93,94,95,96,97,98,99,100], 
                       ['天','周','月']],
        }
    }
    onChange = e => {
        let str=this.state.selector[0][e.detail.value[0]]+this.state.selector[1][e.detail.value[1]];
        this.setState({
          selectorChecked: str
        })
      }
    componentWillMount () {}
    componentDidMount () {}
    componentWillUnmount () {}
    componentDidShow () {}
    componentDidHide () {}
    go(url){
        app.redirectTo(url);
    }
    render () {
        return (
            <View className='suifang-model'>
                <AtForm className=' class_0'>
                    <AtInput placeholder='请输入标题' border={false}></AtInput>
                </AtForm>
                <View className=' class_1'>
                    <View>
                        <Text className=' class_2'>随访开始时间</Text>
                    </View>
                    <View>
                        <Text className=' class_3'>请选择日期</Text>
                        <AtIcon value='chevron-right' className=' class_4'></AtIcon>
                    </View>
                </View>
                <View className=' class_5'>
                    <View>
                        <View className=' class_6'>
                            <View className=' class_7'>
                                <View className=' class_8'></View>
                                <Image className=' class_9' src={app.imageUri+'img/icon-circle-blue3.png'}></Image>
                                <View className=' class_10'></View>
                            </View>
                            <View className=' class_11'>
                                <View className=' class_12'>
                                    <View className=' class_13'>
                                        <Text className=' class_14'>手术后</Text>
                                    </View>
                                    <View className=' class_15'>
                                        <Picker className='picker' mode='multiSelector' range={this.state.selector} onChange={this.onChange}>
                                            <Text className='class_16'>
                                            {this.state.selectorChecked}
                                            </Text>
                                            <AtIcon value='chevron-down' className=' class_17'></AtIcon>
                                        </Picker>                                        
                                    </View>
                                </View>
                            </View>
                        </View>
                        <View className=' class_18'>
                            <View className=' class_19'>
                                <View className=' class_20'></View>
                            </View>
                            <View className=' class_21'>
                                <View className=' class_22'>
                                    <View className=' class_23'>
                                        <Text className=' class_24'>向患者发送</Text>
                                        <AtIcon value='chevron-right' className=' class_25'></AtIcon>
                                    </View>
                                    <View className=' class_26'>
                                        <View>
                                            <Text className=' class_27'>用药提醒：</Text>
                                        </View>
                                        <View className=' class_28'>
                                            <Text className=' class_29'>为了您的尽快康复，请记得遵照医嘱按时按量服药哦。</Text>
                                        </View>
                                        <View>
                                            <AtIcon value='close-circle' className=' class_30'></AtIcon>
                                        </View>
                                    </View>
                                </View>
                            </View>
                        </View>
                    </View>
                    <View>
                        <View className=' class_31'>
                            <View className=' class_32'>
                                <View className=' class_33'></View>
                                <Image className=' class_34' src={app.imageUri+'img/icon-jian2.png'}></Image>
                                <View className=' class_35'></View>
                            </View>
                            <View className=' class_36'>
                                <View className=' class_37'>
                                    <View className=' class_38'>
                                        <Text className=' class_39'>手术后</Text>
                                    </View>
                                    <View className=' class_40'>
                                        <Picker className='picker' mode='multiSelector' range={this.state.selector} onChange={this.onChange}>
                                            <Text className='class_41'>
                                            {this.state.selectorChecked}
                                            </Text>
                                            <AtIcon value='chevron-down' className=' class_42'></AtIcon>
                                        </Picker>  
                                        {/* <Text className=' class_41'>后2周</Text>
                                        <AtIcon value='chevron-down' className=' class_42'></AtIcon> */}
                                    </View>
                                </View>
                            </View>
                        </View>
                        <View className=' class_43'>
                            <View className=' class_44'>
                                <View className=' class_45'></View>
                            </View>
                            <View className=' class_46'>
                                <View className=' class_47'>
                                    <View className=' class_48'>
                                        <Text className=' class_49'>向患者发送</Text>
                                        <AtIcon value='chevron-right' className=' class_50'></AtIcon>
                                    </View>
                                    <View className=' class_51'>
                                        <View>
                                            <Text className=' class_52'>复诊提醒：</Text>
                                        </View>
                                        <View className=' class_53'>
                                            <Text className=' class_54'>该回院复诊了哦，请您今日尽快来院复诊、复查。</Text>
                                        </View>
                                        <View>
                                            <AtIcon value='close-circle' className=' class_55'></AtIcon>
                                        </View>
                                    </View>
                                    <View className=' class_56'>
                                        <View>
                                            <Text className=' class_57'>患教资料：</Text>
                                        </View>
                                        <View className=' class_58'>
                                            <Text className=' class_59'>白内障术后怎么做眼部护理？</Text>
                                        </View>
                                        <View>
                                            <AtIcon value='close-circle' className=' class_60'></AtIcon>
                                        </View>
                                    </View>
                                    <View className=' class_61'>
                                        <View>
                                            <Text className=' class_62'>随访表单：</Text>
                                        </View>
                                        <View className=' class_63'>
                                            <Text className=' class_64'>白内障问诊表？</Text>
                                        </View>
                                        <View>
                                            <AtIcon value='close-circle' className=' class_65'></AtIcon>
                                        </View>
                                    </View>
                                </View>
                            </View>
                        </View>
                    </View>
                    <View className=' class_66'>
                        <View className=' class_67'>
                            <Image className=' class_68' src={app.imageUri+'img/icon-add-green.png'}></Image>
                        </View>
                        <View className=' class_69'>
                            <View className=' class_70'>
                                <View className=' class_71'>
                                    <Text className=' class_72'>添加随访次数</Text>
                                </View>
                            </View>
                        </View>
                    </View>
                </View>
                {/* <AtForm className='remind'>
                    <AtSwitch title='提前一天提示我' checked={true}/>
                </AtForm>
                <View className='at-article__p tips'>
                    提前一天提示我提前一天提示我提前一天提示我提前一天提示我提前一天提示我提前一
                    <AtIcon className='alert-icon' value='alert-circle' size='18' color='#0079fe'></AtIcon>
                </View> */}
                <AtActionSheet isOpened cancelText='取消'>
                    <AtActionSheetItem>就诊</AtActionSheetItem>
                    <AtActionSheetItem>手术</AtActionSheetItem>
                    <AtActionSheetItem>出院</AtActionSheetItem>
                    <AtActionSheetItem>咨询</AtActionSheetItem>
                </AtActionSheet>
                <AtActionSheet isOpened cancelText='取消'>
                    <AtActionSheetItem>用药提醒</AtActionSheetItem>
                    <AtActionSheetItem>复诊提醒</AtActionSheetItem>
                    <AtActionSheetItem>换药提醒</AtActionSheetItem>
                    <AtActionSheetItem>手术提醒</AtActionSheetItem>
                    <AtActionSheetItem>患教资料</AtActionSheetItem>
                    <AtActionSheetItem>随访表单</AtActionSheetItem>
                </AtActionSheet>
                <View className='blank-box'></View>
                <View className='at-row btn-box'>
                    <View className='at-col at-col-6'>
                        <AtButton type='primary' full={true} className='cancel-btn'>删除计划</AtButton> 
                    </View>
                    <View className='at-col at-col-6'>
                        <AtButton type='primary' full={true} className='update-btn'>保存计划</AtButton> 
                    </View>
                </View>
            </View>
        );
    }
}
// reactMixin.onClass(Editsuifangfangan,myJs);